<!--
 * @Author: 孙大大
 * @Date: 2022-01-29 09:52:18
 * @LastEditTime: 2022-01-29 18:36:46
 * @FilePath: \bilibili_m\index.html
-->
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta
            name="keywords"
            content="哔哩哔哩, 哔哩哔哩漫画, bilibili 漫画官方网站, 漫画,动画, 原创, 正版, 海贼王, 五等分的新娘, 约定的梦幻岛, 辉夜大小姐想让我告白 ~天才们的恋爱头脑战~, 关于我转生变成史莱姆这档事, 我的英雄学园, 修真聊天群, 乔乔的奇妙冒险, 斗罗大陆, 一拳超人, 灵能百分百, 铳梦"
        />
        <meta
            name="description"
            content="哔哩哔哩正版漫画阅读平台, 海量官方漫画连载在线观看, 二次元动漫迷的追漫神器, 热门漫画: 海贼王, 五等分的新娘, 约定的梦幻岛, 辉夜大小姐想让我告白 ~天才们的恋爱头脑战~, 关于我转生变成史莱姆这档事, 我的英雄学园, 修真聊天群, 乔乔的奇妙冒险, 斗罗大陆, 我家大师兄脑子有坑, 一拳超人, 灵能百分百, 铳梦等"
        />
        <title>哔哩哔哩漫画 - bilibili 正版漫画平台</title>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
        <link rel="stylesheet" href="./css/base.css" />
        <link rel="stylesheet" href="./lib/swiper-master/package/swiper-bundle.css" />
        <link rel="stylesheet" href="./css/index.css" />
    </head>
    <body>
        <!-- 顶部导航 -->
        <div class="nav">
            <div class="nav_list w">
                <div class="logo">
                    <img src="./images/logo.png" />
                </div>
                <div class="list">
                    <div class="tuijian"><a href="./index.html">推荐</a></div>
                    <div class="paihang">排行</div>
                    <div class="fenlei"><a href="./class.html">分类</a></div>
                </div>
                <div class="download">下载哔哩哔哩漫画</div>
            </div>
        </div>

        <!-- 身体部分 -->
        <div class="body w">
            <!-- 轮播 -->
            <div class="one swiper">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="./images/8.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/9.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/10.jpg" />
                    </div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
            </div>
            <!-- 卡片列表 -->
            <div class="list">
                <div class="card">
                    <div class="img">
                        <img src="./images/1.jpg" />
                    </div>
                    <h3>我独自盗墓</h3>
                    <span>都市</span>
                    <div class="num">
                        <div class="left">275</div>
                        <div class="right"><i></i>3.52w</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/7.jpg" />
                    </div>
                    <h3>无法升级的玩家</h3>
                    <span>都市</span>
                    <div class="num">
                        <div class="left">025</div>
                        <div class="right"><i></i>2121</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/2.jpg" />
                    </div>
                    <h3>爷就是开挂少女</h3>
                    <span>架空</span>
                    <div class="num">
                        <div class="left">169</div>
                        <div class="right"><i></i>1.68w</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/3.jpg" />
                    </div>
                    <h3>从一级开始的异世界骑士</h3>
                    <span>热血</span>
                    <div class="num">
                        <div class="left">176</div>
                        <div class="right"><i></i>3.49w</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/4.jpg" />
                    </div>
                    <h3>骷髅奶爸</h3>
                    <span>西幻</span>
                    <div class="num">
                        <div class="left">114</div>
                        <div class="right"><i></i>1.18w</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/5.jpg" />
                    </div>
                    <h3>修罗武神</h3>
                    <span>玄幻</span>
                    <div class="num">
                        <div class="left">448</div>
                        <div class="right"><i></i>2.17w</div>
                    </div>
                </div>

                <div class="card">
                    <div class="img">
                        <img src="./images/6.jpg" />
                    </div>
                    <h3>垃圾堆里皇女</h3>
                    <span>西幻</span>
                    <div class="num">
                        <div class="left">49</div>
                        <div class="right"><i></i>2905</div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <script src="./lib/swiper-master/package/swiper-bundle.min.js"></script>
    <script>
        var mySwiper = new Swiper('.swiper', {
            loop: true, // 循环模式选项
            autoplay: true,

            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
            },
        })
    </script>
</html>
